import { useAppStoreWithout } from '@/stores/modules/app'

const appStore = useAppStoreWithout()

export const useComputeApp = () => {
  const layout = computed(() => appStore.getLayout)

  const currentSize = computed(() => appStore.getCurrentSize)

  const greyMode = computed(() => appStore.getGreyMode)

  const mobile = computed(() => appStore.getMobile)

  const collapse = computed(() => appStore.getCollapse)

  const breadcrumb = computed(() => appStore.getBreadcrumb)

  const breadcrumbIcon = computed(() => appStore.getBreadcrumbIcon)

  const title = computed(() => appStore.getTitle)

  const uniqueOpened = computed(() => appStore.getUniqueOpened)

  const sizeMap = computed(() => appStore.getSizeMap)

  const fixedMenu = computed(() => appStore.getFixedMenu)

  const tagsViewIcon = computed(() => appStore.getTagsViewIcon)

  const isDark = computed(() => appStore.getIsDark)

  const fixedHeader = computed(() => appStore.getFixedHeader)

  const footer = computed(() => appStore.getFooter)

  const message = computed(() => appStore.getMessage)

  const hamburger = computed(() => appStore.getHamburger)

  const screenfull = computed(() => appStore.getScreenfull)

  const search = computed(() => appStore.search)

  const locale = computed(() => appStore.getLocale)

  const size = computed(() => appStore.getSize)

  const pageLoading = computed(() => appStore.getPageLoading)

  const tagsView = computed(() => appStore.getTagsView)

  const logo = computed(() => appStore.getLogo)

  const layoutCurrentSize = computed(() => appStore.getCurrentSize)

  return {
    layout,
    currentSize,
    greyMode,
    mobile,
    collapse,
    breadcrumbIcon,
    title,
    uniqueOpened,
    sizeMap,
    fixedMenu,
    tagsViewIcon,
    isDark,
    fixedHeader,
    footer,
    message,
    hamburger,
    breadcrumb,
    screenfull,
    search,
    locale,
    size,
    pageLoading,
    tagsView,
    logo,
    layoutCurrentSize
  }
}
